<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

<h:head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Welcome to Car Rent Inc</title>
</h:head>

<ui:composition template="/templates/frame.xhtml">
	<ui:param name="activeIndex" value="5" />
	<ui:define name="page">
		<h:form id="closedRequestForm">
			<rich:dataTable value="#{closedRequestManagedBean.requests}"
				var="req" id="closedRequestTable" iterationStatusVar="it"
				styleClass="center">
				<f:facet name="header">
					<rich:columnGroup>
						<rich:column>
							<h:outputText value="#" />
						</rich:column>
						<rich:column>
							<h:outputText value="Client" />
						</rich:column>
						<rich:column>
							<h:outputText value="Car" />
						</rich:column>
						<rich:column>
							<h:outputText value="Car number" />
						</rich:column>
						<rich:column>
							<h:outputText value="Begin date" />
						</rich:column>
						<rich:column>
							<h:outputText value="End date" />
						</rich:column>
						<rich:column>
							<h:outputText value="Request status" />
						</rich:column>
						<rich:column>
							<h:outputText value="Cancellation purpose" />
						</rich:column>
						<rich:column>
							<h:outputText value="Edit" />
						</rich:column>
					</rich:columnGroup>
				</f:facet>
				<rich:column styleClass="background">
					<rich:collapsibleSubTableToggler for="sub_table" />
					<h:outputText value="#{it.index}" />
				</rich:column>
				<rich:column styleClass="background">
					<h:outputText value="#{req.client.firstName} "
						styleClass="background" />
					<h:outputText value="#{req.client.lastName}"
						styleClass="background" />
				</rich:column>
				<rich:column styleClass="background">
					<h:outputText value="#{req.car.manufacturer} " />
					<h:outputText value="#{req.car.model}" />
				</rich:column>
				<rich:column styleClass="background">
					<h:outputText value="#{req.car.number}" />
				</rich:column>
				<rich:column styleClass="background">
					<h:outputText value="#{req.beginDate}">
						<f:convertDateTime pattern="dd.MM.yyyy" />
					</h:outputText>
				</rich:column>
				<rich:column styleClass="background">
					<h:outputText value="#{req.endDate}">
						<f:convertDateTime pattern="dd.MM.yyyy" />
					</h:outputText>
				</rich:column>
				<rich:column styleClass="background">
					<h:outputText value="#{req.status}" />
				</rich:column>
				<rich:column styleClass="background">
					<h:outputText value="#{req.cancellationPurpose}" />
				</rich:column>
				<rich:column>
					<a4j:region>
						<a4j:commandLink action="#{closedRequestManagedBean.initRequest}"
							execute="@this" onclick="#{rich:component('editPane')}.show()">
							<h:graphicImage value="/images/edit.gif" alt="edit" />
						</a4j:commandLink>
					</a4j:region>
				</rich:column>
				<rich:collapsibleSubTable value="#{closedRequestManagedBean.bills}"
					var="bill" id="sub_table" expandMode="client" expanded="#{false}">
					<f:facet name="header">
						<rich:columnGroup>
							<rich:column colspan="2">
								<h:outputText value="Sum" />
							</rich:column>
							<rich:column colspan="3">
								<h:outputText value="Purpose" />
							</rich:column>
							<rich:column colspan="3">
								<h:outputText value="Status" />
							</rich:column>
							<rich:column colspan="1">
								<h:outputText value="Edit" />
							</rich:column>
						</rich:columnGroup>
					</f:facet>
					<rich:column colspan="2">
						<h:outputText value="#{bill.sum}" />
					</rich:column>
					<rich:column colspan="2">
						<h:outputText value="#{bill.billPurpose}" />
					</rich:column>
					<rich:column colspan="2">
						<h:outputText value="#{bill.status}" />
					</rich:column>
				</rich:collapsibleSubTable>
			</rich:dataTable>
			<div style="text-align: center;">
				<a4j:commandButton value="first"
					action="#{closedRequestManagedBean.pageFirst}"
					disabled="#{closedRequestManagedBean.firstRow == 0}"
					render="closedRequestForm" execute="@this" />
				<a4j:commandButton value="prev"
					action="#{closedRequestManagedBean.pagePrevious}"
					disabled="#{closedRequestManagedBean.firstRow == 0}"
					render="closedRequestForm" execute="@this" />
				<a4j:commandButton value="next"
					action="#{closedRequestManagedBean.pageNext}"
					disabled="#{closedRequestManagedBean.firstRow + closedRequestManagedBean.rowsPerPage >= closedRequestManagedBean.totalRows}"
					render="closedRequestForm" execute="@this" />
				<a4j:commandButton value="last"
					action="#{closedRequestManagedBean.pageLast}"
					disabled="#{closedRequestManagedBean.firstRow + closedRequestManagedBean.rowsPerPage >= closedRequestManagedBean.totalRows}"
					render="closedRequestForm" execute="@this" />
				<h:outputText
					value="Page #{closedRequestManagedBean.currentPage} / #{closedRequestManagedBean.totalPages}" />
			</div>
			<rich:popupPanel id="statPane" autosized="true">
				<h:graphicImage value="/images/ai.gif" alt="ai" />
            Please wait...
        	</rich:popupPanel>
			<rich:popupPanel header="Edit request" id="editPane"
				onmaskclick="#{rich:component('editPane')}.hide()"
				domElementAttachment="parent" autosized="true">
				<h:panelGrid columns="2">
					<h:outputText value="Cancellation purpose: " />
					<h:inputText
						value="#{closedRequestManagedBean.request.cancellationPurpose}" />
				</h:panelGrid>
				<a4j:commandButton value="Approve editing"
					action="#{closedRequestManagedBean.updateRequest}"
					render="closedRequestTable"
					oncomplete="#{rich:component('editPane')}.hide(); return false;" />
				<a4j:commandButton value="Cancel"
					onclick="#{rich:component('editPane')}.hide(); return false;" />
			</rich:popupPanel>
		</h:form>
	</ui:define>
</ui:composition>
</html>